<template>
	<div class="flex align-center">
		<img :src="logoImg" alt="" class="nav-logo mr35" />
		<p class="nav-title mr35">{{ title }}</p>
		<div class="active-btn" v-show="activeTopMenu.name">
			{{ activeTopMenu.name }}
		</div>
	</div>
</template>

<script setup lang="ts">
import { useUserStore } from '@/stores/user'
import logoImg from '@/assets/icons/yzb.png'
const title = '"宁享养老"综合信息平台'
const store = useUserStore()
const { activeTopMenu } = storeToRefs(store)
</script>

<style scoped lang="scss">
.mr35 {
	margin-right: 35px;
}
.nav-logo {
  width: vw(50);
  height: vw(50);
}
.nav-title {
	font-family: 'Microsoft YaHei Bold';
	font-weight: 700;
	font-size: 24px;
	line-height: 22px;
	text-align: center;
	color: #1c1c28;
}
.active-btn {
  padding: 0 6px;
	min-width: vw(160);
  height:vw(41);
  line-height:vw(41);
	border-radius: 10px;
	background: #4787f01a;
	border: 1px solid #4787f0;
	text-align: center;
	font-weight: bold;
}
</style>
